<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CX网络购物中心--心之所想，触手可得</title>
    <link rel="icon" href="CX.png" type="image/png">
    <link rel="stylesheet" href="index.css">
    <link rel="stylesheet" href="product.css">
</head>
<body>
    <header>
        <div class="header-mask"></div>
        <div class="container">
            <search>
                <div class="logo">
                    <img class="CX" src="CX.png" alt="">
                    <img class="CXCN" src="CXCN.png" alt="">
                </div>
                <div class="Input">
                    <input type="text" id="searchInput" placeholder="用户、商品、商家、品牌等">
                    <img class="camera" src="images/拍照.svg" alt="">
                    <button type="submit">搜索</button>    
                </div>    
            </search>
            <div class="bianjie">
                <a href="https://www.tmall.com/" target="_blank">天&nbsp;&nbsp;&nbsp;&nbsp;猫</a>
                <a href="https://www.taobao.com/" target="_blank">淘&nbsp;&nbsp;&nbsp;&nbsp;宝</a>
                <a href="https://www.jd.com/" target="_blank">京&nbsp;&nbsp;&nbsp;&nbsp;东</a>
                <a href="" target="_blank">药&nbsp;&nbsp;&nbsp;&nbsp;品</a>
                <a href="https://passport.meituan.com/account/unitivelogin" target="_blank">美&nbsp;&nbsp;团</a>
                <a href="https://h5.ele.me/" target="_blank">饿&nbsp;了&nbsp;么</a>

                <a href="" target="_blank">菜&nbsp;&nbsp;&nbsp;&nbsp;市</a>
                <a href="" target="_blank">肉&nbsp;&nbsp;&nbsp;&nbsp;市</a>
                <a href="" target="_blank">超&nbsp;&nbsp;&nbsp;&nbsp;市</a>
                <a href="" target="_blank">电&nbsp;&nbsp;&nbsp;&nbsp;影</a>
                <a href="" target="_blank">2&nbsp;元&nbsp;好&nbsp;物</a>
                <a href="" target="_blank">电&nbsp;玩&nbsp;娱&nbsp;乐</a>
            </div>
            <div class="hot">
                <div class="container">
                    <div class="hot-1" onclick="window.open('#', '_blank');">
                        <img src="images/青菜.png" alt="">
                        <a href="">新品上市！</a>
                    </div> 
                    <div class="hot-2" onclick="window.open('#', '_blank');">
                        <img src="images/猪肉.png" alt="">
                        <a href="">降价啦！！</a>
                    </div>
                    <div class="hot-3" onclick="window.open('#', '_blank');">
                        <img src="images/直播.png" alt="">
                        <a href="">岑溪融媒体直播带货</a>
                    </div>  
                    <div class="hot-4" onclick="window.open('#', '_blank');">
                        <img src="images/鞋子.png" alt="">
                        <a href="">优惠！</a>
                    </div> 
                    <div class="hot-5" onclick="window.open('#', '_blank');">
                        <img src="images/服饰.png" alt="">
                        <a href="">清仓甩卖！特价！</a>
                    </div>
                </div>   
            </div>
        </div>
    </header>
<nav>
    <div class="container">
        <div class="left-list" id="leftNav">
            <div class="list" id="section1"><img src="images/11类家用电器x16.svg" alt=""><a href="#">电视</a>/<a href="">空调</a>
                /<a href="">洗衣机</a>/<a href="">冰箱</a>
                <div class="right-content" id="rightContent1">
                    <a href="#">游戏电视</a><a href="">miniled电视</a><a href="">会议电视</a><a href="">电视音响套装</a><a href="#">艺术电视</a>
                    <br>
                    <a href="#">75寸电视</a><a href="">85寸电视</a><a href="">98寸电视</a>
                    <br>
                    <a href="#">新风空调</a><a href="">移动空调</a><a href="">以旧换新</a><a href="">空调挂机</a><a href="">空调柜机</a>
                    <br>
                    <a href="">空调套装</a><a href="">新一级能效</a><a href="">挂机1.5匹</a><a href="">柜机3匹</a><a href="">变频空调</a>
                    <br>
                    <a href="">滚筒洗洗衣机</a><a href="">衣机洗烘一体机</a><a href="">波轮洗衣机</a><a href="">洗烘套装</a><a href="">迷你洗衣机</a>
                    <br>
                    <a href="">油烟机灶具</a><a href="">集成灶</a><a href="">集成水槽</a><a href="">消毒柜</a><a href="">洗碗机</a>
                    <br>
                    <a href="">电热水器</a><a href="">燃气热水器</a><a href="">壁挂炉</a><a href="">空气能热水器</a><a href="">太阳能热水器</a>
                    <br>
                    <a href="">破壁机</a><a href="">咖啡机</a><a href="">榨汁机</a><a href="">电炖锅</a><a href="">电烤箱</a>
                    <br>
                    <a href="">果蔬净化清洗机</a><a href="">电饼铛</a><a href="">电热水壶</a>
                </div>
            </div>
            <div class="list" id="section2">
                <img src="images/房屋房产.svg" alt=""><a href="">房产中介</a>
                /<a href="" target="_blank">楼盘</a>
                <div class="right-content" id="rightContent2">
                    <a href="#">最新开盘</a>
                    <a href="#">商业楼房</a>
                    <a href="#">租房</a>
                    <br>
                    <a href="#">廉租房</a>
                    <a href="#">别墅</a>
                    <a href="">文旅地产</a>
                </div>
            </div>
            <div class="list" id="section3">
                <img src="images/电脑_o.svg" alt=""><a href="">电脑</a>/
                <a href="" target="_blank">办公</a>/<a href="">手机</a>/<a href="" target="_blank">运营商</a>
                <div class="right-content" id="rightContent3">
                    <a href="">笔记本</a><a href="">游戏本</a><a href="">平板电脑</a><a href="">台式机</a><a href="">一体机</a><a href="">服务器</a><a href="">工作站</a>
                    <br>
                    <a href="">显示器</a><a href="">CPU</a><a href="">主板</a><a href="">显卡</a><a href="">硬盘</a><a href="">内存</a><a href="">机箱</a><a href="">电源</a><a href="">散热器</a>
                    <br>
                    <a href="">显示器支架</a><a href="">刻录机</a><a href="">光驱</a><a href="">声卡</a><a href="">扩展卡</a><a href="">装机配件</a><a href="">USB分线器</a>
                    <br>
                    <a href="#">SSD固态</a><a href="">硬盘</a><a href="">组装电脑</a><a href="">主板</a>
                    <br>
                    <a href="">鼠标</a><a href="">键鼠套装</a><a href="">网络仪表仪器</a><a href="">U盘</a><a href="">移动固态硬盘</a><a href="">移动硬盘</a>
                    <br>
                    <a href="">鼠标垫</a><a href="">摄像头</a><a href="">线缆</a><a href="">手写板</a><a href="">硬盘盒</a><a href="">电脑工具</a><a href="">电脑清洁</a>
                    <br>
                    <a href="">UPS电源插座</a><a href="">平板电脑配件</a><a href="">笔记本配件</a><a href="">投屏器</a><a href="">扩展坞</a><a href="">键盘配件</a><a href="">机柜</a>
                    <br>
                    <a href="">电脑屏幕膜</a><a href="">电脑支架</a><a href="">笔记本散热器</a><a href="">电脑电源</a><a href="">电池</a>
                    <br>
                    <a href="">路由器</a><a href="">交换机</a><a href="">网络机顶盒</a><a href="">网络存储</a><a href="">5G/4G上网</a><a href="">网线</a><a href="">网络配件</a>
                    <br>
                    <a href="">投影机</a><a href="">投影配件</a><a href="">打印机</a><a href="">传真设备</a><a href="">扫描设备</a><a href="">复合机</a><a href="">碎纸机</a>
                    <br>
                    <a href="">考勤门禁</a><a href="">收银机</a><a href="">会议音频视频</a><a href="">保险柜装订/封装机</a><a href="">安防监控</a><a href="">白板</a><a href="">广告机</a>
                    <br>
                    <a href="">办公大屏</a><a href="">会议平板</a><a href="">标签打印设备</a><a href="">其他打印设备</a><a href="">3D打印设备</a><a href="">广告印刷设备</a>
                    <br>
                    <a href="">打印机配件</a><a href="">喷墨打印机</a><a href="">激光打印机</a><a href="#">教育教学一体机</a>
                </div>
            </div>
            <div class="list" id="section4">
                <img src="images/家具-47.svg" alt=""><a href="">家具</a>/
                <a href="" target="_blank">家居</a>/<a href="" target="_blank">厨具</a>
                <div class="right-content" id="rightContent4">
                    <a href="">水具</a><a href="">酒具</a><a href="">烹饪锅具</a><a href="">炒锅</a><a href="">碗碟套装</a><a href="">厨房储物</a><a href="">刀剪</a>
                    <br>
                    <a href="">菜板</a><a href="">锅具套装</a><a href="">茶具</a><a href="">咖啡具</a><a href="">保温杯</a>
                    <br>
                    <a href="">床品四件套</a><a href="">婚庆床品</a><a href="">被子</a><a href="">枕头</a><a href="">毛毯</a><a href="">电热毯</a><a href="">床单</a><a href="">宿舍床帘</a>
                    <br>
                    <a href="">床垫</a><a href="">凉席</a><a href="">蚊帐</a>
                    <br>
                    <a href="">吸顶灯</a><a href="">吊灯</a><a href="">台灯</a><a href="">筒灯</a><a href="">射灯</a><a href="">庭院灯</a><a href="">装饰灯</a>
                    <br>
                    <a href="#">LED灯</a><a href="">氛围照明</a><a href="">落地灯</a><a href="">应急灯</a><a href="">手电节能灯</a>
                    <br>
                    <a href="#">定制衣柜</a><a href="">榻榻米</a><a href="">橱柜门</a><a href="">室内门</a><a href="">防盗门窗</a>
                    <br>
                    <a href="">淋浴房</a><a href="">壁挂炉</a><a href="">散热器</a><a href="">水槽</a><a href="">龙头</a><a href="">淋浴花洒</a><a href="">马桶</a><a href="">智能马桶</a>
                </div>
            </div>
            <div class="list" id="section5">
                <img src="images/衣服,服装.svg" alt=""><a href="">男装</a>/
                <a href="" target="_blank">女装</a>/<a href="" target="_blank">童装</a>/<a href="" target="_blank">内衣</a>
                <div class="right-content" id="rightContent5">
                    <a href="">新品推荐</a><a href="">T恤</a><a href="">牛仔裤</a><a href="">衬衫</a><a href="">休闲裤</a><a href="">运动裤</a><a href="">POLO衫</a><a href="">羽绒服</a><a href="">棉服</a>
                    <br>
                    <a href="">真皮皮衣</a><a href="">衣毛</a><a href="">大衣</a><a href="">夹克</a><a href="">大码男装</a><a href="">西服套装</a><a href="">仿皮皮衣</a><a href="">风衣</a>
                    <br>
                    <a href="">针织衫</a><a href="">马甲/背心</a><a href="">羊毛衫</a><a href="">羊绒衫</a><a href="">西服西裤</a><a href="">卫裤/运动裤</a><a href="">工装</a><a href="">设计师/潮牌</a>
                    <br>
                    <a href="">唐装/中山装</a><a href="">中老年男装</a><a href="">加绒裤</a>
                    <br>
                    <a href="">当季热卖</a><a href="">新品推荐</a><a href="">商场同款</a><a href="">时尚套装</a><a href="">连衣裙</a><a href="">半身裙</a><a href="">T恤</a><a href="">衬衫</a>
                    <br>
                    <a href="">休闲裤</a><a href="">牛仔裤</a><a href="">短外套</a><a href="">卫衣</a><a href="">西装</a><a href="">风衣</a><a href="">针织衫</a><a href="">雪纺衫</a><a href="">大码女装</a>
                    <br>
                    <a href="">中老年女装</a><a href="">短裤</a><a href="">正装裤</a><a href="">马甲</a><a href="">吊带/背心</a><a href="">打底衫</a><a href="">旗袍/汉服</a><a href="">礼服</a><a href="">婚纱</a>
                    <br>
                    <a href="">文胸</a><a href="">睡衣/家居服</a><a href="">男士内裤</a><a href="">女士内裤</a><a href="">吊带/背心</a><a href="">文胸套装</a><a href="">连裤袜/丝袜</a><a href="">泳衣</a>
                </div>
            </div>
            <div class="list" id="section6">
                <img src="images/化妆品.svg" alt=""><a href="">美妆</a>/<a href="">个护清洁</a>
                <div class="right-content" id="rightContent6">
                    <a href="">礼盒</a><a href="">美白</a><a href="">防晒</a><a href="">面膜</a><a href="">洁面</a><a href="">爽肤水</a><a href="">精华</a><a href="">眼霜</a><a href="">乳液/面霜</a>
                    <br>
                    <a href="">卸妆</a><a href="">T区护理</a><a href="#">润唇膏</a>
                    <br>
                    <a href="">隔离</a><a href="">遮瑕</a><a href="">BB粉底</a><a href="">腮红</a><a href="">口红/唇膏</a><a href="">唇釉/唇彩</a><a href="">睫毛膏</a><a href="">眼影</a>
                    <br>
                    <a href="">眼线</a><a href="">眉笔/眉粉</a><a href="">散粉</a><a href="">美甲</a><a href="">女士香水</a><a href="">男士香水</a><a href="">彩妆工具</a>
                    <br>
                    <a href="">控油</a><a href="">洁面</a><a href="">乳液/面霜</a><a href="">面膜</a><a href="">爽肤水</a><a href="">剃须</a><a href="">精华</a><a href="">防晒套装/礼盒</a>
                    <br>
                    <a href="">洗发水</a><a href="">护发素</a><a href="">发膜/精油</a><a href="">造型</a><a href="">染发</a><a href="">烫发</a><a href="">假发</a><a href="">美发工具</a>
                    <br>
                    <a href="">牙膏</a><a href="">牙粉</a><a href="">牙贴</a><a href="">牙刷</a><a href="">牙线</a><a href="">漱口水</a><a href="">口喷</a><a href="">假牙清洁</a><a href="">套装</a>
                    <br>
                    <a href="">花露水</a><a href="">沐浴露</a><a href="">香皂</a><a href="">洗手液</a><a href="">护手霜</a><a href="">浴盐</a><a href="">润肤</a><a href="">精油</a><a href="">美颈</a>
                    <br>
                    <a href="">美胸</a><a href="">纤体塑形</a><a href="">手膜/足膜</a><a href="">男士洗液</a><a href="">走珠/止汗露</a><a href="">脱毛刀/膏套装</a>
                    <br>
                    <a href="">卫生巾</a><a href="">卫生棉条</a><a href="">卫生护垫</a><a href="#">私处护理</a>
                </div>
            </div>
            <div class="list" id="section7">
                <img src="images/女鞋.svg" alt=""><a href="">女鞋</a>/
                <a href="" target="_blank">箱包</a>/<a href="">珠宝</a>/<a href="">首饰</a>
                <div class="right-content" id="rightContent7">
                    <a href="">女士休闲鞋</a><a href="">女士凉鞋</a><a href="">女士单鞋</a><a href="">女士拖鞋</a><a href="">高跟鞋</a><a href="">帆布鞋</a><a href="">布鞋/绣花鞋</a>
                    <br>
                    <a href="">内增高</a><a href="">雨靴</a><a href="">女靴</a><a href="">雪地靴</a><a href="">鱼嘴鞋</a><a href="">Martin靴</a><a href="">踝靴</a><a href="">松糕鞋</a><a href="">坡跟鞋</a>
                    <br>
                    <a href="">防水台鞋</a><a href="">配件</a><a href="">单肩包</a><a href="">手提包</a><a href="">斜挎包</a><a href="">双肩包</a><a href="">钱包</a><a href="">手拿包</a><a href="">卡包</a>
                    <br>
                    <a href="">零钱包</a><a href="">钥匙包</a><a href="">男士钱包</a><a href="">双肩包</a><a href="">单肩/余挎包</a><a href="">商务公文包</a><a href="">男士手包</a>
                    <br>
                    <a href="">行李箱</a><a href="">拉杆包</a><a href="">手提包</a><a href="">旅行包</a><a href="">电脑包</a><a href="">休闲运动包</a><a href="">书包</a><a href="">登山包</a>
                    <br>
                    <a href="#">腰包/胸包旅行包</a>
                    <br>
                    <a href="">GUCCI</a><a href="">COACH</a><a href="">雷朋</a><a href="">施华洛世奇</a><a href="">MK</a><a href="">阿玛尼</a><a href="">菲拉格慕</a><a href="">VERSACE</a>
                    <br>
                    <a href="#">普拉达</a><a href="">巴宝莉</a><a href="">万宝龙</a>
                    <br>
                    <a href="">黄金</a><a href="">时尚饰品</a><a href="">银饰</a><a href="">钻石</a><a href="">翡翠</a><a href="">和田玉</a><a href="">K金水晶</a><a href="">玛瑙</a><a href="">彩宝</a>
                    <br>
                    <a href="">铂金</a><a href="">钻石</a><a href="">人工彩宝</a><a href="">发饰</a>
                </div>
            </div>
            <div class="list" id="section8">
                <img src="images/男鞋.svg" alt=""><a href="">男鞋</a>/
                <a href="">运动</a>/<a href="">户外</a>
                <div class="right-content" id="rightContent8">
                    <a href="">男士休闲鞋</a><a href="">男士凉鞋</a><a href="">商务/正装皮鞋</a><a href="">正装鞋</a><a href="">帆布鞋</a><a href="">男士拖鞋</a>
                    <br>
                    <a href="">传统布鞋</a><a href="">男靴</a><a href="">雨鞋</a><a href="">工装鞋</a><a href="">跑步鞋</a><a href="">休闲鞋</a><a href="">篮球鞋</a>
                    <br>
                    <a href="">帆布鞋</a><a href="">板鞋</a><a href="">拖鞋</a><a href="">足球鞋</a><a href="">专项运动鞋</a><a href="">训练鞋</a>
                    <br><a href="">跑步机</a><a href="">动感单车</a><a href="">健身车</a><a href="">椭圆机</a><a href="">健综合训练器</a><a href="">划船机</a>
                    <br>
                    <a href="">甩脂机</a><a href="">倒立机</a><a href="">踏步机</a><a href="">哑铃</a><a href="">仰卧板/收腹机</a><a href="">瑜伽用品</a>
                    <br>
                    <a href="">舞蹈用品</a><a href="">运动护具</a><a href="">健腹轮</a><a href="">拉力器/臂力器</a><a href="">跳绳</a><a href="">引体向上器</a>
                    <br>
                    <a href="">山地车</a><a href="">公路车</a><a href="">折叠车</a><a href="">骑行服</a><a href="">城市自行车</a><a href="">穿戴装备</a><a href="">自行车配件</a>
                    <br>
                    <a href="">乒乓球</a><a href="">羽毛球</a><a href="">篮球</a><a href="">足球</a><a href="">轮滑</a><a href="">滑板</a><a href="">网球</a><a href="">高尔夫</a><a href="">台球</a>
                    <br>
                    <a href="">排球</a><a href="">棋牌</a><a href="">麻将</a><a href="">民俗运动</a><a href="">田径鞋</a>
                </div>
            </div>
            <div class="list" id="section9">
                <img src="images/饮食记录.svg" alt=""><a href="">熟食、凉拌</a>/
                <a href="" target="_blank">日常</a>/<a href="" target="_blank">酒店</a>/<a href="" target="_blank">饭店</a>
                <div class="right-content" id="rightContent9">
                    <a href="">苹果</a><a href="">橙子</a><a href="">猕猴桃</a><a href="">火龙果</a><a href="">榴莲</a><a href="">芒果</a><a href="">椰子</a><a href="">车厘子</a><a href="">百香果</a><a href="">柚子</a><a href="">柠檬</a>
                    <br>
                    <a href="">国产水果</a><a href="">进口水果</a><a href="">蛋品</a><a href="">叶菜</a><a href="">葱姜蒜椒</a><a href="">鲜菇茄果瓜类</a><a href="">半加工蔬菜</a>
                    <br>
                    <a href="">半加工豆制品</a><a href="">玉米山药</a><a href="">地瓜/红薯</a><a href="">牛排</a><a href="">牛腩</a><a href="">鸡翅</a><a href="">鱼类虾类蟹类贝类</a>
                    <br>
                    <a href="">海参鱿鱼/章鱼</a><a href="">活鲜三文鱼大闸蟹小龙虾</a><a href="">海鲜加工品</a><a href="">海产干货</a>
                    <br>
                    <a href="">水饺/馄饨</a><a href="">汤圆/元宵</a><a href="">面点</a><a href="">奶酪/黄油</a><a href="">方便速食</a><a href="">火锅丸串</a><a href="">冰淇淋</a><a href="">冷藏饮料</a>
                    <br>
                    <a href="">低温奶</a><a href="#">生日蛋糕</a>
                    <br>
                    <a href="#">岑溪大酒店</a><a href="">福星苑酒家</a><a href="">阿里香大酒店</a><a href="">家和大酒店</a><a href="">古典三黄鸡</a><a href="">君越大酒店</a>
                    <br>
                    <a href="">岑溪饭店</a><a href="">榕湖饭店</a><a href="">格盟酒店</a><a href="">绿草堂</a><a href="">KTV</a><a href="">老牌酸菜鱼</a>
                    <br>
                    <a href="">KFC</a><a href="">塔斯汀</a><a href="">华莱士</a><a href="">幸福之约</a><a href="">朝阳美食</a><a href="">时代影城</a><a href="">万达影城</a><a href="">万达广场</a>
                    <br>
                    <a href="">家嘉超市</a><a href="">亿佳超市</a><a href="">新兴市场</a><a href="">南方市场</a><a href="">中心市场</a><a href="">赵一鸣</a><a href="">零食很忙</a>
                </div>
            </div>
        </div>
        
        <script>
            // 获取左侧导航栏和右侧内容区域的DOM元素
            const leftNav = document.getElementById('leftNav');
            const rightContent = document.getElementById('rightContent');
            let isRightContentVisible = false; // 标记右侧内容是否显示
            let hideTimer; // 用于延迟隐藏右侧内容的定时器

            // 更新右侧内容的位置，使其紧贴左侧导航栏右侧
            function updateRightContentPosition() {
                const leftNavRect = leftNav.getBoundingClientRect(); // 获取左侧导航栏的位置和尺寸
                // 设置右侧内容的left和top，使其紧贴左侧导航栏
                rightContent.style.left = `${leftNavRect.right}px`;
                rightContent.style.top = `${leftNavRect.top}px`;
            }
            // 显示右侧内容区域
            function showRightContent() {
                clearTimeout(hideTimer); // 清除可能存在的隐藏定时器，防止刚要隐藏时又显示
                if (!isRightContentVisible) { // 如果当前未显示
                    isRightContentVisible = true; // 标记为已显示
                    rightContent.style.display = 'block'; // 显示右侧内容
                    updateRightContentPosition(); // 同步更新右侧内容的位置
                }
            }
            // 隐藏右侧内容区域
            function hideRightContent() {
                if (isRightContentVisible) { // 如果当前是显示状态
                    isRightContentVisible = false; // 标记为未显示
                    rightContent.style.display = 'none'; // 隐藏右侧内容
                }
            }
            // 选中所有class为list的块（如左侧菜单的每一项）
            const listItems = document.querySelectorAll('.list');
            // 显示特定右侧内容区域
            function showRightContent(contentId) {
                clearTimeout(hideTimer);
                // 隐藏所有右侧内容
                document.querySelectorAll('.right-content').forEach(content => {
                    content.style.display = 'none';
                });
                // 显示指定的右侧内容
                const rightContent = document.getElementById(contentId);
                if (rightContent) {
                    rightContent.style.display = 'block';
                    updateRightContentPosition(rightContent);
                }
            }
            // 更新特定右侧内容的位置
            function updateRightContentPosition(content) {
                const leftNavRect = leftNav.getBoundingClientRect();
                const scrollY = window.scrollY || window.pageYOffset;
                content.style.left = `${leftNavRect.right}px`;
                content.style.top = `${leftNavRect.top + scrollY}px`; // 添加滚动偏移量
            }
            // 监听滚动事件
            window.addEventListener('scroll', function() {
                // 获取当前显示的右侧内容
                const visibleContent = document.querySelector('.right-content[style*="display: block"]');
                if (visibleContent) {
                    updateRightContentPosition(visibleContent);
                }
            });
            // 给每个list块绑定鼠标事件
            document.querySelectorAll('.list').forEach((item, index) => {
                const contentId = `rightContent${index + 1}`;
                
                item.addEventListener('mouseenter', () => showRightContent(contentId));
                
                item.addEventListener('mouseleave', function(e) {
                    const rightContent = document.getElementById(contentId);
                    if (!rightContent.contains(e.relatedTarget)) {
                        hideTimer = setTimeout(() => {
                            rightContent.style.display = 'none';
                        }, 10);
                    }
                });
            });
            // 鼠标移入右侧内容区域时，清除隐藏定时器
            document.querySelectorAll('.right-content').forEach(content => {
                content.addEventListener('mouseenter', function() {
                    clearTimeout(hideTimer);
                });
                
                content.addEventListener('mouseleave', function(e) {
                    const isMovingToList = Array.from(document.querySelectorAll('.list')).some(item => 
                        item.contains(e.relatedTarget)
                    );
                    if (!isMovingToList) {
                        hideTimer = setTimeout(() => {
                            content.style.display = 'none';
                        }, 200);
                    }
                });
            });
            // 鼠标移出右侧内容区域时，判断鼠标是否进入了任何list块
            rightContent.addEventListener('mouseleave', function(e) {
                // 检查鼠标是否进入了任意一个list块
                const isMovingToList = Array.from(listItems).some(item => 
                    item.contains(e.relatedTarget)
                );
                // 如果没有进入任何一个list块，则设置一个定时器（200ms）后隐藏右侧内容
                if (!isMovingToList) {
                    hideTimer = setTimeout(hideRightContent, 200);
                }
            });
            // 窗口大小调整时，更新右侧内容的位置
            window.addEventListener('resize', updateRightContentPosition);
        </script> 
        <div class="middle-recommand">
            <div class="tuijian-1">
                <img src="images/数码.png" alt="">
                <a href="">手机数码3C</a>
            </div>
            <div class="tuijian-2">
                <img src="images/活动.png" alt="">
                <a href="">市民活动、晚会</a>
            </div>
            <div class="tuijian-3">
                <img class="CX-1" src="CX.png" alt="">
                <img class="CX-2" src="CXCN-SHOPPING.png" alt="">
                <a href="">广告</a>
            </div>
            <div class="tuijian-4">
                <img src="images/家电.png" alt="">
                <a href="">家电狂欢节</a>
            </div>
        </div>
        <div class="user">
            <div class="user-pic">
                <div class="user-p1"><img src="CX.png" alt=""></div>        
                <span>Hi~&nbsp;&nbsp;岑小溪</span>
                <span>登录岑溪购物后有更多优惠~</span>
            </div>
            <div class="login">
                <button onclick="window.open('login.html', '_blank');">立即登录</button>
                <a href="" class="registe" onclick="window.open('login.html', '_blank');">注&nbsp;&nbsp;&nbsp;册 ></a>
            </div>
            <div class="entrance">
                <div class="shopping-car" onclick="window.open('shopping car.html', '_blank');">
                    <img src="images/购物车.svg" alt="">
                    <a href="" target="_blank">购物车</a>
                </div>
                <div class="shoucang">
                    <img src="images/收藏.svg" alt="">
                    <a href="" target="_blank">我的收藏</a>
                </div>
                <div class="kefu">
                    <img src="images/客服.svg" alt="">
                    <a href="" target="_blank">客&nbsp;&nbsp;&nbsp;&nbsp;服</a>                    
                </div>
                <div class="dingdan">
                    <img src="images/订单.svg" alt="">
                    <a href="dingdan.html" target="_blank">订&nbsp;&nbsp;&nbsp;&nbsp;单</a>                    
                </div>
            </div>       
        </div>
    </div>
</nav>
<div class="show">
    <div class="container">
        <div class="nav">
            <button class="jingxvan" onclick="btn16();setActiveButton(this)"><img src="images/精选-已精选.svg" alt=""><span>推荐</span></button>
            <button class="shiqv" onclick="btn1();setActiveButton(this)"><span>市区精选</span></button>
            <button class="cenchengzhen" onclick="btn2();setActiveButton(this)"><span>岑城镇</span></button>
            <button class="guiyizhen" onclick="btn3();setActiveButton(this)"><span>归义镇</span></button>
            <button class="maluzhen" onclick="btn4();setActiveButton(this)"><span>马路镇</span></button>
            <button class="nanduzhen" onclick="btn5();setActiveButton(this)"><span>南渡镇</span></button>
            <button class="shuiwenzhen" onclick="btn6();setActiveButton(this)"><span>水汶镇</span></button>
            <button class="dalongzhen" onclick="btn7();setActiveButton(this)"><span>大隆镇</span></button>
            <button class="dayezhen" onclick="btn8();setActiveButton(this)"><span>大业镇</span></button>
            <button class="jinzhuzhen" onclick="btn9();setActiveButton(this)"><span>筋竹镇</span></button>
            <button class="limuzhen" onclick="btn10();setActiveButton(this)"><span>梨木镇</span></button>
            <button class="botangzhen" onclick="btn11();setActiveButton(this)"><span>波塘镇</span></button>
            <button class="sanbaozhen" onclick="btn12();setActiveButton(this)"><span>三堡镇</span></button>
            <button class="nuodongzhen" onclick="btn13();setActiveButton(this)"><span>糯垌镇</span></button>
            <button class="anpingzhen" onclick="btn14();setActiveButton(this)"><span>安平镇</span></button>
            <button class="chengjianzhen" onclick="btn15();setActiveButton(this)"><span>城谏镇</span></button>
        </div>
        <div class="product">
            <div id="show16">
                <div class="show_16">
                    <img src="images/show-pic/黄金首饰.png" alt="">
                    <p>黄金首饰</p>
                    <span>￥900/克</span>
                    <button class="add-to-cart" onclick="addToCart('黄金首饰', 900, 'images/show-pic/黄金首饰.png')">加入购物车</button>
                </div>
                <div class="show_161">
                    <img src="images/show-pic/钻戒.jpg" alt="">
                    <p>钻&nbsp;戒,求婚戒指</p>
                    <span>￥900/克</span>
                    <button class="add-to-cart" onclick="addToCart('钻&nbsp;戒,求婚戒指', 900, 'images/show-pic/钻戒.jpg')">加入购物车</button>
                </div>  
                <div class="show_161">
                    <img src="images/show-pic/影院.jpg" alt="">
                    <p>看电影~~影院</p>
                    <span>￥20/人 起</span>   
                    <button class="add-to-cart" onclick="addToCart('看电影~~影院', 20, 'images/show-pic/影院.jpg')">加入购物车</button>          
                </div>
                <div class="show_162">
                    <img src="images/show-pic/抽纸.jpg" alt="">
                    <p>抽纸，优惠价</p>
                    <span>￥20/提 起</span>
                    <button class="add-to-cart" onclick="addToCart('抽纸，优惠价', 20, 'images/show-pic/抽纸.jpg')">加入购物车</button>
                </div>
                <div class="show_163">
                    <img src="images/show-pic/短袖.jpg" alt="">
                    <p>短袖，任挑</p>
                    <span>￥9.9 起/件</span>
                    <button class="add-to-cart" onclick="addToCart('短袖，任挑', 9.9, 'images/show-pic/短袖.jpg')">加入购物车</button>
                </div>
                <div class="show_163">
                    <img src="images/show-pic/裙子.jpg" alt="">
                    <p>短袖，任挑</p>
                    <span>￥19.9起/件</span>
                    <button class="add-to-cart" onclick="addToCart('裙子，任挑', 19.9, 'images/show-pic/裙子.jpg')">加入购物车</button>
                </div>
                <div class="show_16">
                    <img src="images/show-pic/黄金首饰.png" alt="">
                    <p>黄金首饰</p>
                    <span>￥900/克</span>
                    <button class="add-to-cart" onclick="addToCart('黄金首饰', 900, 'images/show-pic/黄金首饰.png')">加入购物车</button>
                </div>
                <div class="show_161">
                    <img src="images/show-pic/钻戒.jpg" alt="">
                    <p>钻&nbsp;戒,求婚戒指</p>
                    <span>￥900/克</span>
                    <button class="add-to-cart" onclick="addToCart('钻&nbsp;戒,求婚戒指', 900, 'images/show-pic/钻戒.jpg')">加入购物车</button>
                </div>  
                <div class="show_161">
                    <img src="images/show-pic/影院.jpg" alt="">
                    <p>看电影~~影院</p>
                    <span>￥20/人 起</span>
                    <button class="add-to-cart" onclick="addToCart('看电影~~影院', 20, 'images/show-pic/影院.jpg')">加入购物车</button>
                </div>
                <div class="show_162">
                    <img src="images/show-pic/抽纸.jpg" alt="">
                    <p>抽纸，优惠价</p>
                    <span>￥20/提 起</span>
                    <button class="add-to-cart" onclick="addToCart('抽纸，优惠价', 20, 'images/show-pic/抽纸.jpg')">加入购物车</button>
                </div>
                <div class="show_163">
                    <img src="images/show-pic/短袖.jpg" alt="">
                    <p>短袖，任挑</p>
                    <span>￥9.9 起/件</span>
                    <button class="add-to-cart" onclick="addToCart('短袖，任挑', 9.9, 'images/show-pic/短袖.jpg')">加入购物车</button>
                </div>
                <div class="show_163">
                    <img src="images/show-pic/裙子.jpg" alt="">
                    <p>短袖，任挑</p>
                    <span>￥19.9起/件</span>
                    <button class="add-to-cart" onclick="addToCart('裙子，任挑', 19.9, 'images/show-pic/裙子.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>
            </div>
            <div id="show1">
                <div class="show_1">
                    <img src="images/show-pic/KFC.png" alt="">
                    <p>KFC“疯狂星期四”</p>
                    <span>全家桶 ￥60</span>
                    <button class="add-to-cart" onclick="addToCart('KFC疯狂星期四全家桶', 60, 'images/show-pic/KFC.png')">加入购物车</button>
                </div> 
                <div class="show_1">
                    <img src="images/show-pic/华莱士.jpg" alt="">
                    <p>9块9汉堡套餐等你来</p>
                    <span>全场￥9.9起</span>
                    <button class="add-to-cart" onclick="addToCart('华莱士9块9汉堡套餐', 9.9, 'images/show-pic/华莱士.jpg')">加入购物车</button>
                </div> 
                <div class="show_1">
                    <img src="images/show-pic/塔斯汀.jpg" alt="">
                    <p>星期二会员日买一送一</p>
                    <span>单人￥19.9起</span>
                    <button class="add-to-cart" onclick="addToCart('塔斯汀会员日买一送一', 19.9, 'images/show-pic/塔斯汀.jpg')">加入购物车</button>
                </div>
                <div class="show_1">
                    <img src="images/show-pic/蜜雪.jpg" alt="">
                    <p>蜜雪冰城·甜蜜蜜~</p>
                    <span>全场￥4起</span>
                    <button class="add-to-cart" onclick="addToCart('蜜雪冰城甜蜜蜜', 4, 'images/show-pic/蜜雪.jpg')">加入购物车</button>
                </div>
                <div class="show_1">
                    <img src="images/show-pic/万达.jpg" alt="">
                    <p>万达广场·更懂你</p>
                    <span>随心挑选</span>
                </div>
                <div class="show_1">
                    <img src="images/show-pic/小米之家.jpg" alt="">
                    <p>小米之家·亲近生活</p>
                    <span>无忧服务</span>
                </div>
                <div class="show_1">
                    <img src="images/show-pic/KFC.png" alt="">
                    <p>KFC“疯狂星期四”</p>
                    <span>全家桶 ￥60</span>
                    <button class="add-to-cart" onclick="addToCart('KFC疯狂星期四全家桶', 60, 'images/show-pic/KFC.png')">加入购物车</button>
                </div> 
                <div class="show_1">
                    <img src="images/show-pic/华莱士.jpg" alt="">
                    <p>9块9汉堡套餐等你来</p>
                    <span>全场￥9.9起</span>
                    <button class="add-to-cart" onclick="addToCart('华莱士9块9汉堡套餐', 9.9, 'images/show-pic/华莱士.jpg')">加入购物车</button>
                </div> 
                <div class="show_1">
                    <img src="images/show-pic/塔斯汀.jpg" alt="">
                    <p>星期二会员日买一送一</p>
                    <span>单人￥19.9起</span>
                    <button class="add-to-cart" onclick="addToCart('塔斯汀会员日买一送一', 19.9, 'images/show-pic/塔斯汀.jpg')">加入购物车</button>
                </div>
                <div class="show_1">
                    <img src="images/show-pic/蜜雪.jpg" alt="">
                    <p>蜜雪冰城·甜蜜蜜~</p>
                    <span>全场￥4起</span>
                    <button class="add-to-cart" onclick="addToCart('蜜雪冰城甜蜜蜜', 4, 'images/show-pic/蜜雪.jpg')">加入购物车</button>
                </div>
                <div class="show_1">
                    <img src="images/show-pic/万达.jpg" alt="">
                    <p>万达广场·更懂你</p>
                    <span>随心挑选·无忧服务</span>
                </div>
                <div class="show_1">
                    <img src="images/show-pic/小米之家.jpg" alt="">
                    <p>小米之家·亲近生活</p>
                    <span>随心挑选·无忧服务</span>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>
            </div>
            <div id="show2">
                <div class="show2_1">
                    <img src="images/show-pic/三黄鸡.png" alt="">
                    <p>岑溪三黄鸡（饭）</p>
                    <span>￥39.9/半只</span>
                    <button class="add-to-cart" onclick="addToCart('岑溪三黄鸡（饭）', 39.9, 'images/show-pic/三黄鸡.png')">加入购物车</button>                    
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/石磨米粉.jpg" alt="">
                    <p>石磨米粉</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('石磨米粉', 5, 'images/show-pic/波塘.jpg')">加入购物车</button>                    
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/三黄鸡.png" alt="">
                    <p>岑溪三黄鸡（饭）</p>
                    <span>￥39.9/半只</span>
                    <button class="add-to-cart" onclick="addToCart('岑溪三黄鸡（饭）', 39.9, 'images/show-pic/三黄鸡.png')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/石磨米粉.jpg" alt="">
                    <p>石磨米粉</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('石磨米粉', 5, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/三黄鸡.png" alt="">
                    <p>岑溪三黄鸡（饭）</p>
                    <span>￥39.9/半只</span>
                    <button class="add-to-cart" onclick="addToCart('岑溪三黄鸡（饭）', 39.9, 'images/show-pic/三黄鸡.png')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/石磨米粉.jpg" alt="">
                    <p>石磨米粉</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('石磨米粉', 5, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/三黄鸡.png" alt="">
                    <p>岑溪三黄鸡（饭）</p>
                    <span>￥39.9/半只</span>
                    <button class="add-to-cart" onclick="addToCart('岑溪三黄鸡（饭）', 39.9, 'images/show-pic/三黄鸡.png')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/石磨米粉.jpg" alt="">
                    <p>石磨米粉</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('石磨米粉', 5, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/三黄鸡.png" alt="">
                    <p>岑溪三黄鸡（饭）</p>
                    <span>￥39.9/半只</span>
                    <button class="add-to-cart" onclick="addToCart('岑溪三黄鸡（饭）', 39.9, 'images/show-pic/三黄鸡.png')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/石磨米粉.jpg" alt="">
                    <p>石磨米粉</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('石磨米粉', 5, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/三黄鸡.png" alt="">
                    <p>岑溪三黄鸡（饭）</p>
                    <span>￥39.9/半只</span>
                    <button class="add-to-cart" onclick="addToCart('岑溪三黄鸡（饭）', 39.9, 'images/show-pic/三黄鸡.png')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/石磨米粉.jpg" alt="">
                    <p>石磨米粉</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('石磨米粉', 5, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>               
            </div>
            <div id="show3">
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/归义.jpg" alt="">
                    <p>归义煲粉</p>
                    <span>￥8/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('归义煲粉', 8, 'images/show-pic/归义.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>               
            </div>
            <div id="show4">
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>马路豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('马路豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>               
            </div>
            <div id="show5">
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/南渡.jpg" alt="">
                    <p>南渡白锄</p>
                    <span>￥5/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('南渡白锄', 5, 'images/show-pic/南渡.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>               
            </div>
            <div id="show6">
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <div class="show2_2">
                    <img src="images/show-pic/水汶.jpg" alt="">
                    <p>水汶酿油腐</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('水汶酿油腐', 15, 'images/show-pic/水汶.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>               
            </div>
            <div id="show7">
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/大隆.jpg" alt="">
                    <p>大隆河鱼</p>
                    <span>￥10/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('大隆河鱼', 10, 'images/show-pic/大隆.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>               
            </div>
            <div id="show8">
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/大业.png" alt="">
                    <p>大湴面条</p>
                    <span>￥30/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('大湴面条', 30, 'images/show-pic/大业.png')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>               
            </div>
            <div id="show9">
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/筋竹.jpg" alt="">
                    <p>筋竹米粽</p>
                    <span>&nbsp;&nbsp;￥5/条 &nbsp;起</span>
                    <button class="add-to-cart" onclick="addToCart('筋竹米粽', 5, 'images/show-pic/筋竹.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>
            </div>
            <div id="show10">
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <div class="show2_1">
                    <img src="images/show-pic/马路.jpg" alt="">
                    <p>豆腐酿</p>
                    <span>￥15/份 起</span>
                    <button class="add-to-cart" onclick="addToCart('豆腐酿', 15, 'images/show-pic/马路.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>
            </div>
            <div id="show11">
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>                    
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <div class="show8_1">
                    <img src="images/show-pic/波塘.jpg" alt="">
                    <p>虾饼</p>
                    <span>￥2/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('虾饼', 2, 'images/show-pic/波塘.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>                
            </div>
            <div id="show12">
                <div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>
                </div>
                <div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>
                </div>
                <div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>
                </div>
                <div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>
                </div>
                <div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>
                </div>
                <div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>
                </div>
                <div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>
                </div>
                <div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>                    
                </div><div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>
                </div>
                <div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>
                </div>
                <div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>
                </div>
                <div class="show12_1">
                    <img src="images/show-pic/三堡.jpg" alt="">
                    <p>三堡米粉</p>
                    <span>￥15/箱 起</span>
                    <button class="add-to-cart" onclick="addToCart('三堡米粉', 15, 'images/show-pic/三堡.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>                
            </div>
            <div id="show13">
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>                    
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/糯垌.jpg" alt="">
                    <p>梅菜扣肉</p>
                    <span>￥35/碗 起</span>
                    <button class="add-to-cart" onclick="addToCart('梅菜扣肉', 35, 'images/show-pic/糯垌.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>                
            </div>
            <div id="show14">
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <div class="show7_1">
                    <img src="images/show-pic/安平.jpg" alt="">
                    <p>艾糍</p>
                    <span>￥5/个 起</span>
                    <button class="add-to-cart" onclick="addToCart('艾糍', 5, 'images/show-pic/安平.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>                                
            </div>
            <div id="show15">
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <div class="show3_1">
                    <img src="images/show-pic/城谏.jpg" alt="">
                    <p>薯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;干</p>
                    <span>￥15/斤 起</span>
                    <button class="add-to-cart" onclick="addToCart('薯干', 15, 'images/show-pic/城谏.jpg')">加入购物车</button>
                </div>
                <p class="loading"><img src="images/show-pic/Loading.svg" alt="">正在为您搬运好物 ~ 请稍后</p>                                
            </div>
            <script>
                function setActiveButton(button) {
                    // 移除所有按钮的active类
                    document.querySelectorAll('.nav button').forEach(btn => {
                        btn.classList.remove('active');
                    });
                    // 为当前点击的按钮添加active类
                    button.classList.add('active');
                }
                function btn16() {
                // 设置btn1点击之后会发生什么
                    document.getElementById('show16').style.display = 'flex';document.getElementById('show1').style.display = 'none';
                    document.getElementById('show2').style.display = 'none';document.getElementById('show3').style.display = 'none';
                    document.getElementById('show4').style.display = 'none';document.getElementById('show5').style.display = 'none';
                    document.getElementById('show6').style.display = 'none';document.getElementById('show7').style.display = 'none';
                    document.getElementById('show8').style.display = 'none';document.getElementById('show9').style.display = 'none';
                    document.getElementById('show10').style.display = 'none';document.getElementById('show11').style.display = 'none';
                    document.getElementById('show12').style.display = 'none';document.getElementById('show13').style.display = 'none';
                    document.getElementById('show14').style.display = 'none';document.getElementById('show15').style.display = 'none';
                }
                function setActiveButton(button) {
                    // 移除所有按钮的active类
                    document.querySelectorAll('.nav button').forEach(btn => {btn.classList.remove('active');});
                    // 为当前点击的按钮添加active类
                    button.classList.add('active');
                }
                window.onload = function() {
                // 移除所有按钮的active类
                    document.querySelectorAll('.nav button').forEach(btn => {
                    btn.classList.remove('active');
                });
                // 显示默认内容
                    btn16();
                // 手动激活"推荐"按钮
                    document.querySelector('.jingxvan').classList.add('active');
                };
                function btn1() {
                // 这里就是跟btn1一样的意思 点击btn2之后show1会隐藏 同时show2显示
                    document.getElementById('show16').style.display = 'none';document.getElementById('show1').style.display = 'flex';
                    document.getElementById('show2').style.display = 'none';document.getElementById('show3').style.display = 'none';
                    document.getElementById('show4').style.display = 'none';document.getElementById('show5').style.display = 'none';
                    document.getElementById('show6').style.display = 'none';document.getElementById('show7').style.display = 'none';
                    document.getElementById('show8').style.display = 'none';document.getElementById('show9').style.display = 'none';
                    document.getElementById('show10').style.display = 'none';document.getElementById('show11').style.display = 'none';
                    document.getElementById('show12').style.display = 'none';document.getElementById('show13').style.display = 'none';
                    document.getElementById('show14').style.display = 'none';document.getElementById('show15').style.display = 'none';
                }
                function btn2() {
                    document.getElementById('show1').style.display = 'none';document.getElementById('show2').style.display = 'flex';
                    document.getElementById('show3').style.display = 'none';document.getElementById('show4').style.display = 'none';
                    document.getElementById('show5').style.display = 'none';document.getElementById('show6').style.display = 'none';
                    document.getElementById('show7').style.display = 'none';document.getElementById('show8').style.display = 'none';
                    document.getElementById('show9').style.display = 'none';document.getElementById('show10').style.display = 'none';
                    document.getElementById('show11').style.display = 'none';document.getElementById('show12').style.display = 'none';
                    document.getElementById('show13').style.display = 'none';document.getElementById('show14').style.display = 'none';
                    document.getElementById('show15').style.display = 'none';document.getElementById('show16').style.display = 'none';
                }
                function btn3(){
                    document.getElementById('show2').style.display = 'none';document.getElementById('show3').style.display = 'flex';
                    document.getElementById('show4').style.display = 'none';document.getElementById('show5').style.display = 'none';
                    document.getElementById('show6').style.display = 'none';document.getElementById('show7').style.display = 'none';
                    document.getElementById('show8').style.display = 'none';document.getElementById('show9').style.display = 'none';
                    document.getElementById('show10').style.display = 'none';document.getElementById('show11').style.display = 'none';
                    document.getElementById('show12').style.display = 'none';document.getElementById('show13').style.display = 'none';
                    document.getElementById('show14').style.display = 'none';document.getElementById('show15').style.display = 'none';
                    document.getElementById('show16').style.display = 'none';document.getElementById('show1').style.display = 'none';
                }
                function btn4(){
                    document.getElementById('show3').style.display = 'none';document.getElementById('show4').style.display = 'flex';
                    document.getElementById('show5').style.display = 'none';document.getElementById('show6').style.display = 'none';
                    document.getElementById('show7').style.display = 'none';document.getElementById('show8').style.display = 'none';
                    document.getElementById('show9').style.display = 'none';document.getElementById('show10').style.display = 'none';
                    document.getElementById('show11').style.display = 'none';document.getElementById('show12').style.display = 'none';
                    document.getElementById('show13').style.display = 'none';document.getElementById('show14').style.display = 'none';
                    document.getElementById('show15').style.display = 'none';document.getElementById('show16').style.display = 'none';
                    document.getElementById('show1').style.display = 'none';document.getElementById('show2').style.display = 'none';
                }
                function btn5(){
                    document.getElementById('show4').style.display = 'none';document.getElementById('show5').style.display = 'flex';
                    document.getElementById('show6').style.display = 'none';document.getElementById('show7').style.display = 'none';
                    document.getElementById('show8').style.display = 'none';document.getElementById('show9').style.display = 'none';
                    document.getElementById('show10').style.display = 'none';document.getElementById('show11').style.display = 'none';
                    document.getElementById('show12').style.display = 'none';document.getElementById('show13').style.display = 'none';
                    document.getElementById('show14').style.display = 'none';document.getElementById('show15').style.display = 'none';
                    document.getElementById('show16').style.display = 'none';document.getElementById('show1').style.display = 'none';
                    document.getElementById('show2').style.display = 'none';document.getElementById('show3').style.display = 'none';
                }
                function btn6(){
                    document.getElementById('show5').style.display = 'none';document.getElementById('show6').style.display = 'flex';
                    document.getElementById('show7').style.display = 'none';document.getElementById('show8').style.display = 'none';
                    document.getElementById('show9').style.display = 'none';document.getElementById('show10').style.display = 'none';
                    document.getElementById('show11').style.display = 'none';document.getElementById('show12').style.display = 'none';
                    document.getElementById('show13').style.display = 'none';document.getElementById('show14').style.display = 'none';
                    document.getElementById('show15').style.display = 'none';document.getElementById('show16').style.display = 'none';
                    document.getElementById('show1').style.display = 'none';document.getElementById('show2').style.display = 'none';
                    document.getElementById('show3').style.display = 'none';document.getElementById('show4').style.display = 'none';
                }
                function btn7(){
                    document.getElementById('show6').style.display = 'none';document.getElementById('show7').style.display = 'flex';
                    document.getElementById('show8').style.display = 'none';document.getElementById('show9').style.display = 'none';
                    document.getElementById('show10').style.display = 'none';document.getElementById('show11').style.display = 'none';
                    document.getElementById('show12').style.display = 'none';document.getElementById('show13').style.display = 'none';
                    document.getElementById('show14').style.display = 'none';document.getElementById('show15').style.display = 'none';
                    document.getElementById('show16').style.display = 'none';document.getElementById('show1').style.display = 'none';
                    document.getElementById('show2').style.display = 'none';document.getElementById('show3').style.display = 'none';
                    document.getElementById('show4').style.display = 'none';document.getElementById('show5').style.display = 'none';
                }
                function btn8(){
                    document.getElementById('show7').style.display = 'none';document.getElementById('show8').style.display = 'flex';
                    document.getElementById('show9').style.display = 'none';document.getElementById('show10').style.display = 'none';
                    document.getElementById('show11').style.display = 'none';document.getElementById('show12').style.display = 'none';
                    document.getElementById('show13').style.display = 'none';document.getElementById('show14').style.display = 'none';
                    document.getElementById('show15').style.display = 'none';document.getElementById('show16').style.display = 'none';
                    document.getElementById('show1').style.display = 'none';document.getElementById('show2').style.display = 'none';
                    document.getElementById('show3').style.display = 'none';document.getElementById('show4').style.display = 'none';
                    document.getElementById('show5').style.display = 'none';document.getElementById('show6').style.display = 'none';
                }
                function btn9(){
                    document.getElementById('show8').style.display = 'none';document.getElementById('show9').style.display = 'flex';
                    document.getElementById('show10').style.display = 'none';document.getElementById('show11').style.display = 'none';
                    document.getElementById('show12').style.display = 'none';document.getElementById('show13').style.display = 'none';
                    document.getElementById('show14').style.display = 'none';document.getElementById('show15').style.display = 'none';
                    document.getElementById('show16').style.display = 'none';document.getElementById('show1').style.display = 'none';
                    document.getElementById('show2').style.display = 'none';document.getElementById('show3').style.display = 'none';
                    document.getElementById('show4').style.display = 'none';document.getElementById('show5').style.display = 'none';
                    document.getElementById('show6').style.display = 'none';document.getElementById('show7').style.display = 'none';
                }
                function btn10(){
                    document.getElementById('show9').style.display = 'none';document.getElementById('show10').style.display = 'flex';
                    document.getElementById('show11').style.display = 'none';document.getElementById('show12').style.display = 'none';
                    document.getElementById('show13').style.display = 'none';document.getElementById('show14').style.display = 'none';
                    document.getElementById('show15').style.display = 'none';document.getElementById('show16').style.display = 'none';
                    document.getElementById('show1').style.display = 'none';document.getElementById('show2').style.display = 'none';
                    document.getElementById('show3').style.display = 'none';document.getElementById('show4').style.display = 'none';
                    document.getElementById('show5').style.display = 'none';document.getElementById('show6').style.display = 'none';
                    document.getElementById('show7').style.display = 'none';document.getElementById('show8').style.display = 'none';
                }
                function btn11(){
                    document.getElementById('show10').style.display = 'none';document.getElementById('show11').style.display = 'flex';
                    document.getElementById('show12').style.display = 'none';document.getElementById('show13').style.display = 'none';
                    document.getElementById('show14').style.display = 'none';document.getElementById('show15').style.display = 'none';
                    document.getElementById('show16').style.display = 'none';document.getElementById('show1').style.display = 'none';
                    document.getElementById('show2').style.display = 'none';document.getElementById('show3').style.display = 'none';
                    document.getElementById('show4').style.display = 'none';document.getElementById('show5').style.display = 'none';
                    document.getElementById('show6').style.display = 'none';document.getElementById('show7').style.display = 'none';
                    document.getElementById('show8').style.display = 'none';document.getElementById('show9').style.display = 'none';
                }
                function btn12(){
                    document.getElementById('show11').style.display = 'none';document.getElementById('show12').style.display = 'flex';
                    document.getElementById('show13').style.display = 'none';document.getElementById('show14').style.display = 'none';
                    document.getElementById('show15').style.display = 'none';document.getElementById('show16').style.display = 'none';
                    document.getElementById('show1').style.display = 'none';document.getElementById('show2').style.display = 'none';
                    document.getElementById('show3').style.display = 'none';document.getElementById('show4').style.display = 'none';
                    document.getElementById('show5').style.display = 'none';document.getElementById('show6').style.display = 'none';
                    document.getElementById('show7').style.display = 'none';document.getElementById('show8').style.display = 'none';
                    document.getElementById('show9').style.display = 'none';document.getElementById('show10').style.display = 'none';
                }
                function btn13(){
                    document.getElementById('show12').style.display = 'none';document.getElementById('show13').style.display = 'flex';
                    document.getElementById('show14').style.display = 'none';document.getElementById('show15').style.display = 'none';
                    document.getElementById('show16').style.display = 'none';document.getElementById('show1').style.display = 'none';
                    document.getElementById('show2').style.display = 'none';document.getElementById('show3').style.display = 'none';
                    document.getElementById('show4').style.display = 'none';document.getElementById('show5').style.display = 'none';
                    document.getElementById('show6').style.display = 'none';document.getElementById('show7').style.display = 'none';
                    document.getElementById('show8').style.display = 'none';document.getElementById('show9').style.display = 'none';
                    document.getElementById('show10').style.display = 'none';document.getElementById('show11').style.display = 'none';
                }
                function btn14(){
                    document.getElementById('show13').style.display = 'none';document.getElementById('show14').style.display = 'flex';
                    document.getElementById('show15').style.display = 'none';document.getElementById('show16').style.display = 'none';
                    document.getElementById('show1').style.display = 'none';document.getElementById('show2').style.display = 'none';
                    document.getElementById('show3').style.display = 'none';document.getElementById('show4').style.display = 'none';
                    document.getElementById('show5').style.display = 'none';document.getElementById('show6').style.display = 'none';
                    document.getElementById('show7').style.display = 'none';document.getElementById('show8').style.display = 'none';
                    document.getElementById('show9').style.display = 'none';document.getElementById('show10').style.display = 'none';
                    document.getElementById('show11').style.display = 'none';document.getElementById('show12').style.display = 'none';
                }
                function btn15(){
                    document.getElementById('show14').style.display = 'none';document.getElementById('show15').style.display = 'flex';
                    document.getElementById('show16').style.display = 'none';document.getElementById('show1').style.display = 'none';
                    document.getElementById('show2').style.display = 'none';document.getElementById('show3').style.display = 'none';
                    document.getElementById('show4').style.display = 'none';document.getElementById('show5').style.display = 'none';
                    document.getElementById('show6').style.display = 'none';document.getElementById('show7').style.display = 'none';
                    document.getElementById('show8').style.display = 'none';document.getElementById('show9').style.display = 'none';
                    document.getElementById('show10').style.display = 'none';document.getElementById('show11').style.display = 'none';
                    document.getElementById('show12').style.display = 'none';document.getElementById('show13').style.display = 'none';
                }
            </script>
        </div>
    </div>
</div>
<div class="sider">
    <div class="my">
        <img class="my-pic" src="images/我的，我.svg" alt="">
        <a href="login.html" target="_blank">我的</a>
    </div>
    <div class="xiaoxi">
        <img class="xiaoxi-pic" src="images/消息.svg" alt="">
        <a href="">消息</a>
    </div>
    <div class="history">
        <img class="history-pic" src="images/历史记录.svg" alt="">
        <a href="">我的足迹</a>
    </div>
    <div class="fankui">
        <img class="fankui-pic" src="images/意见反馈.svg" alt="">
        <a href="">意见反馈</a>
    </div>
</div>
<footer>
    <div class="container">
        <div class="footer">
            <a href="">关于我们</a>
            <a href="">联系我们</a>
            <a href="">隐私政策</a>
            <a href="">加入我们</a>
            <a href="">反馈服务</a>
        </div>
    </div>
</footer>
<button id="backToTop"><img src="images/向上.svg" alt=""></button>
<script>
    // 显示/隐藏按钮
    window.addEventListener('scroll', function() {
        const btn = document.getElementById('backToTop');
        if (window.scrollY > 300) {
            btn.style.display = 'block';
        } else {
            btn.style.display = 'none';
        }
    });
    // 点击按钮返回顶部
    document.getElementById('backToTop').onclick = function() {
        window.scrollTo({ top: 0, behavior: 'smooth' });
    };
</script>
<div id="toast" class="toast"></div>
</body>
</html>

<script>
    // 商品映射表
    const productMap = {
        '黄金首饰': 'show16','钻戒': 'show16','戒指':'show16','电影':'show16',
        '影院':'show16','抽纸':'show16','短袖':'show16',
        'KFC':'show1','华莱士':'show1','塔斯汀':'show1',
        '蜜雪冰城':'show1','万达广场':'show1','小米之家':'show1',
        '星期二':'show1','星期四':'show1','9块9':'show1',
        '石磨米粉':'show2','三黄鸡':'show2',
        '归义煲粉':'show3',
        '马路豆腐酿':'show4',
        '南渡白锄':'show5',
        '水汶酿油腐': 'show6',
        '大隆河鱼': 'show7',
        '大湴面条': 'show8',
        '筋竹米粽': 'show9',
        '豆腐酿': 'show10',
        '虾饼': 'show11',
        '三堡米粉': 'show12',
        '梅菜扣肉': 'show13',
        '艾糍': 'show14',
        '薯干': 'show15'
    };

    // 城镇与商品映射关系
    const townButtonMap = {
        'show16': 'btn16',  //推荐
        'show1': 'btn1',   // 市区精选
        'show2': 'btn2',   // 岑城镇
        'show3': 'btn3',   // 归义镇
        'show4': 'btn4',   // 马路镇
        'show5': 'btn5',   // 南渡镇
        'show6': 'btn6',   // 水汶镇
        'show7': 'btn7',   // 大隆镇
        'show8': 'btn8',   // 大业镇
        'show9': 'btn9',   // 筋竹镇
        'show10': 'btn10', // 梨木镇
        'show11': 'btn11', // 波塘镇
        'show12': 'btn12', // 三堡镇
        'show13': 'btn13', // 糯垌镇
        'show14': 'btn14', // 安平镇
        'show15': 'btn15'  // 城谏镇
    };

    // 搜索功能函数
    function performSearch() {
        const searchTerm = document.getElementById('searchInput').value.trim();
        if (!searchTerm) {
            alert('请输入搜索内容');
            return;
        }
        
        // 查找匹配的商品
        for (const [name, id] of Object.entries(productMap)) {
            if (name.includes(searchTerm)) {
                // 显示匹配的商品区域
                const targetSection = document.getElementById(id);
                if (targetSection) {
                    targetSection.style.display = 'flex';
                    
                    // 隐藏其他商品区域
                    document.querySelectorAll('[id^="show"]').forEach(el => {
                        if (el.id !== id) el.style.display = 'none';
                    });
                    
                    // 滚动到该区域
                    targetSection.scrollIntoView({ behavior: 'smooth' });
                    
                    // 激活对应城镇按钮
                    const btnId = townButtonMap[id];
                    if (btnId) {
                        // 移除所有按钮的active类
                        document.querySelectorAll('.nav button').forEach(btn => {
                            btn.classList.remove('active');
                        });
                        // 添加active类到对应按钮
                        const targetBtn = document.querySelector(`.nav button[onclick*="${btnId}"]`);
                        if (targetBtn) {
                            targetBtn.classList.add('active');
                        }
                    }
                    return;
                }
            }
        }        
        // 没有找到匹配商品
        alert('未找到匹配的商品');
        // 恢复默认显示
        btn16();
    }
    // 确保DOM加载完成后再绑定事件
    document.addEventListener('DOMContentLoaded', function() {
        // 点击搜索按钮
        const searchBtn = document.querySelector('.Input button');
        if (searchBtn) {
            searchBtn.addEventListener('click', performSearch);
        }        
        // 回车键触发搜索
        const searchInput = document.getElementById('searchInput');
        if (searchInput) {
            searchInput.addEventListener('keypress', function(e) {
                if (e.key === 'Enter') {
                    performSearch();
                }
            });
        }
    });
</script>
<script>
    // 购物车数据
    let cartItems = JSON.parse(localStorage.getItem('cartItems')) || [];    
    // 添加商品到购物车
    function addToCart(name, price, image) {
        const existingItem = cartItems.find(item => item.name === name);       
        if (existingItem) {
            existingItem.quantity += 1;
        } else {
            cartItems.push({
                name,
                price,
                image,
                quantity: 1
            });
        }
        
        // 保存到本地存储
        localStorage.setItem('cartItems', JSON.stringify(cartItems));
        
        // 更新购物车显示
        updateCartCount();        
        alert(`已添加 ${name} 到购物车`);
    }
    
    // 更新购物车数量显示
    function updateCartCount() {
        const totalItems = cartItems.reduce((total, item) => total + item.quantity, 0);
        const cartCountElement = document.querySelector('.cart-count');
        if (cartCountElement) {
            cartCountElement.textContent = totalItems;
        }
    } 
    // 页面加载时更新购物车数量
    document.addEventListener('DOMContentLoaded', updateCartCount);
</script>
